<template>
  <div class="login">
      <div class="logo">
        <img :src="logoImg" alt="">
      </div>
      <div class="input_item">
        <van-cell-group>
          <van-field
            center
            v-model="account"
            placeholder="请输入账号"
            icon="clear"
            error-message="手机号格式错误"
            @click-icon="account = ''">
          </van-field>
          <van-field
            center
            v-model="password"
            placeholder="请输入正确密码"
            type='password'
            icon="clear"
            @click-icon="password = ''" class="password">
          </van-field>
        </van-cell-group>
      </div>
      <div class="login_btn" @click="loginGo">
        <van-button type="default">登录</van-button>
      </div>
  </div>
</template>
<script>
export default {
  data(){
      return{
        logoImg:require("../../assets/img/logo.png"),
        account:'',
        password:''
      }
  },
  methods:{
    loginGo(){
      this.$router.push({path:'/menu'})
    }
  }
}
</script>
<style scoped lang='less'>
  .login{
    text-align: center;
    .login_btn{
      margin-top:0.56rem;
    };
    .logo{
      padding-top:4.1067rem;
      margin-bottom:0.9333rem;
    };
    .input_item{
      padding-left: 1.8133rem;
    };
    .van-cell-group{
      background-color:transparent;
        .van-cell--center{
          padding:0;
          padding-bottom:0.56rem;
          background-color: transparent;
        };
    };
  }

</style>
<style>
    .login .van-field--has-icon input.van-field__control{
      background-color: transparent;
        width:6.3467rem;
        height:0.9067rem;
        padding-left:0.2667rem;
        background: url('../../assets/img/input_kuang.png') no-repeat;
        background-size:100% 100%; 
    }
   [class*=van-hairline]::after{
      border:none;
    }
    .login .van-button--default{
        width: 2.0267rem;
        height: 0.9067rem;
        line-height: 0.9067rem;
        background: url('../../assets/img/login_btn.png');
        background-size:100% 100%;
        font-size:0.4rem;
    }
    .login .van-field__icon{
      top:50%;
      right:2rem;
    }
    .login .van-cell__value{
      overflow: visible;
    }
    .login .van-field__error-message{
      position: absolute;
    }
</style>



